<template>
  <div class="dashboard-editor-container">
    <a-page-header
      title="协议号批次详情"
      sub-title=""
      @back="() => $router.go(-1)"
    >
      <template #extra>

      </template>
      <a-descriptions size="small" :column="3">
        <a-descriptions-item v-if="batchInfo.batch_obj != undefined && batchInfo.batch_obj != null" label="导入文件名称">{{batchInfo.batch_obj.file_name}}</a-descriptions-item>
        <a-descriptions-item v-if="batchInfo.batch_obj != undefined && batchInfo.batch_obj != null" label="成功导入数量">{{batchInfo.batch_obj.success}}</a-descriptions-item>
        <a-descriptions-item v-if="batchInfo.batch_obj != undefined && batchInfo.batch_obj != null" label="无ME数据">{{batchInfo.batch_obj.not_me}}</a-descriptions-item>
        <a-descriptions-item v-if="batchInfo.batch_obj != undefined && batchInfo.batch_obj != null" label="错误号码">{{batchInfo.batch_obj.phone_error}}</a-descriptions-item>
        <a-descriptions-item v-if="batchInfo.batch_obj != undefined && batchInfo.batch_obj != null" label="重复号码">{{batchInfo.batch_obj.phone_repeat}}</a-descriptions-item>
        <a-descriptions-item v-if="batchInfo.batch_obj != undefined && batchInfo.batch_obj != null" label="Key异常">{{batchInfo.batch_obj.keystore_error}}</a-descriptions-item>
        <a-descriptions-item v-if="batchInfo.batch_obj != undefined && batchInfo.batch_obj != null" label="无法入库">
          {{batchInfo.batch_obj.in_db}}
          <a-tag color="#f50" v-if="batchInfo.batch_obj.in_db > 0" >重要提示</a-tag>
          <a v-if="batchInfo.batch_obj.in_db > 0" :href="baseUrl2+'?batch='+batchInfo.batch_obj.batch_uuid" target='_blank'>
            <el-button type="warning"  size="mini" round>导出无法入库号码</el-button>
          </a>
        </a-descriptions-item>
        <a-descriptions-item v-if="batchInfo.batch_obj != undefined && batchInfo.batch_obj != null" label="导入时间">{{batchInfo.batch_obj.createtime}}</a-descriptions-item>
        <a-descriptions-item v-if="batchInfo.batch_obj != undefined && batchInfo.batch_obj != null" label="Remarks">
          {{batchInfo.batch_obj.batch_uuid}}
        </a-descriptions-item>
      </a-descriptions>
      <a-row type="flex" v-if="batchInfo.batch_check" style="margin-top: 20px;">
        <a-statistic title="批次待检测数量" style="margin-left: 15px;margin-right: 15px;" :value="batchInfo.batch_check.wait_check" />
        <a-statistic title="商业号"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.batch_check.business_num" />
        <a-statistic title="个人号"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.batch_check.personal" />
      </a-row>
      <a-row type="flex" style="margin-top: 20px;">
        <a-statistic title="待使用号码" style="margin-left: 15px;margin-right: 15px;" :value="batchInfo.wait_use" />
        <a-statistic title="成功恢复"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.recover_num" />
        <a-statistic title="已使用成功恢复率(%)"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.use_recover_rate" />
        <a-statistic title="全部号码成功恢复率(%)"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.all_recover_rate" />
        <a-statistic title="其他设备"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.other_device" />
        <a-statistic title="无效协议"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.protocol_invalid" />
        <a-statistic title="其它错误"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.other_error" />
        <a-statistic title="账户信息异常"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.timeout_num" />
      </a-row>
      <a-row type="flex" style="margin-top: 20px;">
        <a-statistic title="成功登录实例"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.login_success" />
<!--        <a-statistic title="当前在线实例"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.online_num" />-->
        <a-statistic title="已使用成功登录率(%)"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.use_success_rate" />
        <a-statistic title="全部号码成功登录率(%)"  style="margin-left: 15px;margin-right: 15px;"  :value="batchInfo.all_success_rate" />
      </a-row>
    </a-page-header>

    <el-alert
      title="提示"
      type="info"
      description="采用缓存制度,待使用会批量缓存,号码数据可能一段时间无变化,或处于中间状态(即:登录中、网络异常等,异常账户将会在10~15分钟重置状态) 导致数据与总量不符。"
      show-icon>
    </el-alert>

  </div>
</template>

<script>
import { getInfo,resetTimeout,reStart } from '@/api/protocol'

export default {
  name: 'protocol_info',
  created() {
    this.queryList.id = this.$route.params.id
    if (!this.$route.params.id || this.$route.params.id == 0 || this.$route.params.id == undefined) {
      this.$notify.error({ title: this.$t('v520.reqFail'), message: '任务id为无效id' })
      this.$store.dispatch('tagsView/delView', this.$route)
      this.$router.go(-1)
    }
    this.getDataList()
  },
  data() {
    return {
      baseUrl:process.env.VUE_APP_BASE_API+'/protocol/exportAccount',
      baseUrl2:process.env.VUE_APP_BASE_API+'/protocol/exportUnable',
      activeName:'country',
      total: 0,
      batchInfo:{
        batch_country_info:[]
      },
      queryList: {
        id:0,
        limit: 999,
        page: 1
      }
    }
  },
  methods: {
    back(){
      this.$store.dispatch('tagsView/delView', this.$route)
      this.$router.go(-1)
    },
    resetBatchTimeout(){
      resetTimeout({id:this.$route.params.id}).then(res => {
          if(res.code == 0){
            this.$message.success('重置成功');
            this.getDataList();
          }else{
            this.$message.error(res.msg);
          }
      }).catch(err =>{
        this.$message.error('发起请求失败,请重新发起');
      });
    },
    resetAll(){
      reStart({id:this.$route.params.id}).then(res => {
        if(res.code == 0){
          this.$message.success('重置成功');
          this.getDataList();
        }else{
          this.$message.error(res.msg);
        }
      }).catch(err =>{
        this.$message.error('发起请求失败,请重新发起');
      });
    },
    getDataList() {
      const loading = this.$loading({
        lock: true,
        text: this.$t('v520.getting'),
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      getInfo(this.queryList).then(res => {
        loading.close()
        this.batchInfo = res.data;
      }).catch(e => {
        loading.close()
        this.$message.error('请求失败')
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.dashboard-editor-container {
  background-color: #FFF;
  min-height: 100vh;
  padding: 20px 20px 0px;

  .pan-info-roles {
    font-size: 12px;
    font-weight: 700;
    color: #333;
    display: block;
  }

  .info-container {
    position: relative;
    margin-left: 190px;
    height: 150px;
    line-height: 200px;

    .display_name {
      font-size: 48px;
      line-height: 48px;
      color: #212121;
      position: absolute;
      top: 25px;
    }
  }
}
</style>
